<template>
  <el-upload
    class="avatar-uploader"
    ref="uploadRef"
    action="https://qw.ccpluss.com/common/upload"
    :limit="1"
    :show-file-list="false"
    :on-success="handleAvatarSuccess(value)"
    :disabled="type == 'text'?true:false"
  >
    <img
      v-if="form[value] && isUrlFromDomain"
      :src="form[value]"
      class="avatar"
    />
    <img
      v-else-if="form[value]"
      :src="
        form.img
          ? 'https://qw.ccpluss.com' + form.img
          : 'https://qw.ccpluss.com' + form[value]
      "
      class="avatar"
    />
    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
  </el-upload>
</template>

<script>
export default {
  props: {
    form: {
      type: Object,
      default: function () {
        return {};
      },
    },
    value: {
      type: String,
      default: "",
    },
    type: {
      type: String,
      default: "",
    },
  },
  data() {
    return {};
  },
  computed: {
    isUrlFromDomain() {
    const url = this.form[this.value];
    const domain = 'wdcdn.qpic.cn'
    // 使用正则表达式匹配 URL 的域名部分
    const regex = new RegExp(`^https://${domain}/`, 'i');
    // 返回匹配结果
    return regex.test(url);
    }
  },
  created() {},
  mounted() {},
  watch: {},
  methods: {
    // 图片上传
    handleAvatarSuccess(value) {
      console.log(value);
      return (response, file) => {
        this.$emit("ChangeImg", {
          fileRaw: URL.createObjectURL(file.raw),
          value: value,
          img: response.msg,
        });
        this.$refs.uploadRef.clearFiles();
      };
    },
  },
  components: {},
};
</script>

<style scoped lang="less">
.avatar {
  width: 120px;
  height: 120px;
  display: block;
}
</style>
